			<#include "./header.html">	
			<#include "./nave.html">	
			<div class="c_body shadow" >
			
			<style>
				.ds_view .panel{
					float: left;
				    border: 1px solid #999;
				    border-radius: 5px;
				    width: 400px;
				    height: 95%;
				    margin: 10px;
				    background: rgba(0,0,0,0.2);
				    box-shadow: 5px 5px 5px rgba(0,0,0,0.5);
							
				}
			   .panel .title{
			       height: 30px;
				    line-height: 30px;
				    text-align: center;
				    box-shadow: 1px 1px 2px rgba(0,0,0,0.8);
				    /* border-bottom: 1px solid #888; */
				    border-radius: 3px;
			    }
			    .panel .items{
			   		 padding:3px;
			    }
			  
			   
			   
			    .panel .items .item:hover{
			        border: 1px solid #02F135;
			    }
			    .panel .items .item.active{
			     
			    }
			    #eqptSelect{
				    position: absolute;
				    background: #256A6C;
				    left: 30%;
				    width: 600px;
				    top:10%;
			    }
			    #eqptSelect .content{
			    padding:5px;
			    }
			    .modalLayout{
				    background: rgba(43, 73, 156, 0.2);
				    height: 100%;
				    width: 100%;
				    position: fixed;
				    top: 0;
				    left: 0;
				    z-index: 2;
			    }
			    .modalLayout .panel{
			        box-shadow: 2px 2px 10px rgba(0,0,0,0.8);
				    border-radius:4px;
				    border: 1px solid #ddd;
			    }
			    
			    .panel  .nav_items  .level_2::before{
			        /* content: "";
				    display: block;
				    width: 15px;
				    height: 15px;
				    border-radius: 2px;
				    
				    border: 2px solid #fff;
				    float: left;
				    margin: 0px 5px 5px -25px; */
				   
			    }
			    .panel  .nav_items  .level_2.active::before{	  
				  /* background: #63FF13;  	 */
			    }
			    #search_tool{
				    display: inline-block;
	                padding-left: 20px;
	                float:right;
			    }
			    #search_input{
				    height: 22px;
				    background-color: black;
				    border: 1px solid white;
				    border-radius: 3px;
				    color: white;
			    }
			    .title_tool a{
			      font-size: 1.2em;
			    }
			</style>
					<div class="page_view">
					    <div class="ds_tool   gradient">
					        <span class="title">
					        
					        </span> 
						</div>
						
						<div class="ds_view">
						 <div class="panel"   id="userGroup"  tar="${s.base}/admin/depts_json"> 
						    <div class="title gradient" id="title"> <span>用户组</span> 
					 
						    <div class="title_tool">
					            <a href="#"  id="plus"  ><i class="fa fa-plus-square"  ></i></a> 
							    <a href="#"   id="minus" ><i class="fa fa-minus-square" ></i></a>
		                        <a href="#"   id="minus" ><i class="fa fa-refresh " id="menberRefresh" ></i></a>
						        <a href="#"   id="save" > <i class="fa fa-save "  ></i> </a>
						    </div>
						    
						     </div>
						    <div class="content scroll tree_body" >
						    <ul class="tree_content tree_bd" id="userdept" >
						    </ul>
						    </div>
						 </div>
						 <div class="panel"   id="userList" >
						    <div class="title gradient" id="title"><span>用户列表</span> 
							    <div class="title_tool">
						            <a href="#"  id="plus"  ><i class="fa fa-plus-square"  ></i></a> 
								    <a href="#"   id="minus" ><i class="fa fa-minus-square" ></i></a>
			                        <a href="#"   id="minus" ><i class="fa fa-cog "   ></i></a>
							        <a href="#"   id="save" > <i class="fa fa-save "  ></i> </a>
							    </div>
						    
						     </div>
						    <div class="content scroll">
						    
						    </div>
						 </div>
						 
						   <div class="panel"   id="equipmentList" >
						    <div class="title gradient" id="title"><span>权限设备</span>
						    <div class="title_tool">
						        <a href="#"   > <i class="fa fa-cog " id="addEquipt" ></i>  </a> 
							    <a href="#"   > <i class="fa fa-save" id="eqptsave" ></i>  </a> 
							 
						    </div>
						    
						    </div>
						    <div class="content scroll">
						    		 
						    </div>
						 </div>
						
					     </div>
					</div>
			</div>
		</div>
	<!-- 	对话框 -->
		 <div class="modalLayout  " style="display:none" >
							 <div class="panel  colorable"   id="eqptSelect" >
							    <div class="title gradient" id="title"><span>设备权限</span>
							   

	                                <span class="titlebtn" id="cancel">取消</span><span class="titlebtn" id="ok">确定</span>
	                                <div  id="search_tool"><input type="text" id="search_input"  ><a href="#" id="eqp_search"><i class="fa fa-search fa-lg"></i></a></div>
	                                
                                </div>
							    <div class="content scroll">
							         <ul class='nav_items' tar="${s.base}/equip/geteqplist">
		               	                  <div>正在加载设备列表.. ..</div>
		             
		              	            </ul>	 
					             </div>
			 </div>
						
		  </div>
						 
						 
		 <#include "../pc/flooder.html">	
	

	    <script>
		
		 
	    $(function($){
	    	function loadContent(tar){
	    		var turl=tar.attr("tar");
	    		tar.find(".content").load(turl);
	    	}
	    	//显示   搜索   输入框
        	$("#eqp_search").on("click",function(){
        		  var _this=$(this);
        		  if($("#search_input").css("display")=="none")
        		     $("#search_input").show();
        		  else{
        			  $("#search_input").hide();  
        			  $("#eqptSelect .level_2").show();
        		  }
        	});
	      //查询
	    	$("#search_input").on("keydown",function(event){
	       		 var keycode = (event.keyCode ? event.keyCode : event.which); 
	       		/*  switch(event.keyCode) {
	       		    // ...
	       		    // 不同的按键可以做不同的事情
	       		    // 不同的浏览器的keycode不同
	       		    // 更多详细信息:     http://unixpapa.com/js/key.html
	       		    // ...
	       		    if()
	       		  } */
	       		  console.log(keycode);
	       		 if(keycode==13){
	       			 var _text=$("#search_input").val();
	       			  console.log(_text);
	       			  $("#eqptSelect .level_2").hide();
	       			 /*  console.log(".level_2 .name:contains('"+_text+"')");
	       			  alert( $(".level_2 .name:contains('"+_text+"')").length) */
	       			  $("#eqptSelect .level_2 .name:contains('"+_text+"')").parent().show();
	       		 }
       		

         	});
	      
	      
	    	
	        //加载  微信 用户组 部门  
	    	loadJSON($("#userGroup"));
	    	
	    	$("body").on("click",".tree_item span",function(){
	    		
		    		var _this=$(this).parent().parent();
		    		
		    		 if(true){
	 		    			// if(!_this.hasClass("select")){
		    			 $(".tree_item").removeClass("select");
			    		  _this.addClass("select"); 

		            	  var _depid=_this.attr("id").substring(1);//$("#userList").attr("tar").match(/[1-9][0-9]*/g); 

		             	  var items=_this.find(".tree_item.nor");
		             	  
		             	  var ids=[];
		             	  $.each(items,function(){
		             		  //d+id 去除前缀 d
		             		  ids.push($(this).attr("id").substring(1));
		             	  })
		             	  if(_this.hasClass("nor"))
		             	  ids.push(_depid);
		             	  
		             	  
		             	 $("#equipmentList .content").load(CONETXT_PATH+"/admin/addequipment",{depid:ids.join(","),eqpids:''},function(){
		             		   $(this).find("a").attr("href","#");
	                      });
		             	//  alert(JSON.stringify(ids));
		             	  
		             	//   var turl=CONETXT_PATH+"/admin/dmembers.do"
		             	 //  $("#userList").find(".content").load(turl,JSON.stringify(ids));
		             	   
		             	  $.ajax({ 
					            type:"POST", 
					            url:CONETXT_PATH+"/admin/dmembers.do", 
					            dataType:"html",      
					            contentType:"application/json",               
					            data: JSON.stringify(ids), 
					            success:function(data){ 
					            	//显示保存结果
					            $("#userList").find(".content").html(data);
					                      
					            } 
					         }); 
		             	 //  $("#userList").attr("tar",_this.attr("tar"));
			             //	loadContent($("#userList"));
		    		 }
	             	
	             	///切换用户组 的时候 清除已经选中的设备
	                $(".level_2.active").removeClass("active");
	             	
	    	});
	    	
	    	/*    window.onresize = function(){
		    		 
	    			  
	    		   adjustwindow();
	    		   } */
	    	   adjustwindow();
	    	  function  adjustwindow(){
	    			 $(".panel .content").height($(".panel").height()-$(".panel .title").height()-10);
	    	   }
 
	            
	    	
	    	    //加载视频用户列表
                var tar=$("#eqptSelect .nav_items");
            	tar.load(tar.attr("tar"));
            	
            	$("body").off("click", ".level_2>.name");
            
            	$("body").on(
            			"click",
            			".level_2>.name",
            			function() {
            				var _this = $(this).parent();
            			    _this.toggleClass("active"); 
            			    
            		 return false;
            	});  
            	
            	//设备选择 保存事件
            	$("body").on("click",".titlebtn",function(){
            		var _this=$(this);
            		var id=_this.attr("id");
            		
                     if(id=="ok"){
                    	var eqpts= $(".level_2.active");
                    	 if($("#equipmentList .content ul").length<0)
                    	 $("<ul></ul>").appendTo($("#equipmentList .content"));
                    	 $("#equipmentList .content ul").append(eqpts.removeClass("active").clone());
                    	 $("#equipmentList .content ul a").attr("href","#");
                    	 
                    
                    	 
                     }   else {
                    	
                     } 
                     $(".modalLayout").hide();
            	});
            	
            	$("body").on("click","#eqptsave",function(){
            		
            		var ids=[];
            		var eqpts=$("#equipmentList .content li");
            		if(eqpts.length<0) return;
                	eqpts.each(function(){
                		ids.push($(this).attr("puid"));
                	});
                  
                	var _depid=$(".tree_item.select").attr("id").substring(1);//$("#userList").attr("tar").match(/[1-9][0-9]*/g); 
                 

                     $("#equipmentList .content").load(CONETXT_PATH+"/admin/addequipment",{depid:_depid,eqpids:ids.join(",")},function(){
                	   $(this).find("a").attr("href","#");
                	   showTipInfo({success:true});

                   });  
            	});
            	
            	$("body").on("click","#equipmentList .content .level_2 a",function(e){
            		 
            		 var bCTRL = e.ctrlKey;
            	     if(bCTRL){
            	 
            	    	 $(this).parent().remove();
            	     
            	     }
            	    
            		  return false;
            	});
            	
            	
            	
            	//添加设备 按钮  panel 右上角
            	$("body").on("click","#menberRefresh",function(){
            		$.getJSON(CONETXT_PATH +"/getDepart",{province:$("body").attr("pro")}, function(data){
            			  //显示保存结果
		            	  showTipInfo(data);
		             
		            	  loadJSON($("#userGroup"));
            		 });
            		
            	});
            	
            	//添加设备 按钮  panel 右上角
            	$("body").on("click","#addEquipt",function(){
            		var _depid=$(".tree_item.select");
               
            		 if(_depid.length>0){
            		//	_depid=_depid.match(/[1-9][0-9]*/g); 
	               // 	alert(_depid);
	               //显示设备选中的时候 清除已经选中的设备
	                    $(".level_2.active").removeClass("active");
	            	    $(".modalLayout").show();
            		}else{
            			alert("请先选用户组！");
            		}
            	});
            	// // 树形结构菜单点击

            	$("body").on("click", ".level_1 .span", function(e,t) {
            		
            	 
            		
            		
            		var _this = $(this).parent();
            		if (_this.hasClass("active")) {
            			
            			 var bCTRL = e.ctrlKey;
                	     if(bCTRL){
                	    	 _this.find(".level_2").toggleClass("active");
                	              
                	     }else{
                	    	 _this.removeClass("active");  
                	     }
                	    	
            			return;
            		}
            		$(".level_1.active").removeClass("active");

            		_this.addClass("active");
            		if (_this.find(".item_content").html() == "") {
            			_this.find(".item_content").load(_this.attr("tar"));
            		}
            		
            		
            	});
             
	  
	    })
    
      
	   </script>
	
</body>
